import { Component,Input,OnInit } from '@angular/core';
import {UtilService} from '../my-service/util.service';
import {UserGuidState,UserState,NavState,RosterState,SetRoster,SetNav,BackgroundState,SetBackground,BackgroundVariedState} from '../app.state';
import {Store, Select} from '@ngxs/store';
import {Observable} from 'rxjs';
import {RollService} from '../my-service/roll.service';

@Component({
  selector: 'app-nav',
  templateUrl: './nav.component.html',
  styleUrls: ['./nav.component.css']
})
export class NavComponent {
  @Select(UserGuidState) userGuid$: Observable<any>; //获取用户guid和登录状态
  @Select(UserState) user$:Observable<any>; //获取用户信息
  @Select(NavState) nav$:Observable<any>; //获取当前导航条信息
  @Select(RosterState) roster$:Observable<any>; //获取当前导航条信息
  @Select(BackgroundState) background$:Observable<any>; //获取背景颜色
  @Select(BackgroundVariedState) Varied$:Observable<any>; //获取背景颜色是否渐变
  backGround='#00cccc';
  isVaried=true;//背景颜色是否变色
  isLogin:boolean;
  currentComponent='index';
  className:string;
  userInfo={
    cover:''
  };
  constructor(
    private utilService:UtilService,
    private Store:Store,
    private rollService:RollService
  ) {
    this.matchingRouter();
    // 获取背景是否渐变
    this.Varied$.subscribe(res=>{
      this.isVaried=res;
    });
    // 获取用户登录状态
    this.userGuid$.subscribe(res=>{
      this.isLogin=res.isLogin;
    });
    // 获取用户信息
    this.user$.subscribe(res=>{
      this.userInfo = res;
    });
    // 获取当前组件
    this.nav$.subscribe(res=>{
      if(res){
        this.currentComponent=res;
        if(res!=='index'){
          this.Store.dispatch(new SetBackground('#fff','#00cccc'));
        }else {
          this.backGround='#00cccc';
        }
        if(res=='roster'){
          this.backGround='#fff';
          this.roster$.subscribe(roster=>{
            if(roster.classGuid){
              this.className=roster.className;
            }else {
              this.className=null;
            }
          })
        }
      }else {
        this.currentComponent='index';
      }
    });
    //获取背景颜色
    this.background$.subscribe(res=>{
      this.backGround=res.indexBackground;
    })
  }
  ngOnInit(){
  }
  matchingRouter(){
    if(/home\/rosterInfo/g.test(location.href)){
      //截取班级Guid获取班级名称
      let arr = location.href.split('/');
      let classGuid = arr[arr.length-1];
        this.rollService.getClassList('"'+classGuid+'"').then(res=>{
          if(res.status == 1){
            let className = res.data[0].ClassName;
            this.Store.dispatch(new SetRoster(classGuid,className));
          }else {
          }
        })
    }else if(/home\/enter/g.test(location.href)){
      this.Store.dispatch(new SetNav('enter'));
    }
  }
}
